<!-- 标题头 -->
<script>
export default {
  props: {
    titleText: {
      type: String,
      default: "",
    },
  },
  data() {
    return {};
  },
};
</script>

<template>
  <ul class="common-page-title">
    <li class="common-page-title-left">{{ titleText }}</li>
    <li class="common-page-title-right">
      <slot></slot>
    </li>
  </ul>
</template>

<style lang="scss">
.common-page-title {
  height: 52px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: baseline;
  &-right {
    flex: none;
    text-align: right;
  }
  &-left {
    flex: 1;
    font-size: 20px;
    color: #212121;
    line-height: 28px;
    text-align: left;
  }
}
</style>
